<template>
	<view style="width: 100%;display: flex;flex-direction: column;">
		<view class="top-view">
			<view class="cover-view">
				<image class="jiapu-cover" src="../../static/icon_iitss_book.png" mode="scaleToFill"></image>
			</view>
			<view class="content-view">
				<text class="jiapu-name">{{bookBean.title}}</text>
				<text class="jiapu-faqiren">发起人:{{bookBean.uname}}</text>
				<text class="jiapu-area">所属地区:{{bookBean.area}}</text>
				<text class="jiapu-create-date">创建时间:{{bookBean.createtime}}</text>
			</view>
		</view>
		<view class="center-view">
			<view class="zuyuan-parent">
				<text class="zuyuan-num">{{bookBean.count1}}人</text>
				<text class="zuyuan-txt">族员</text>
			</view>
			<image class="line"></image>
			<view class="zuji-parent">
				<text class="zuji-num">{{bookBean.browse}}次</text>
				<text class="zuji-txt">足迹</text>
			</view>
		</view>
		<view style="width: 100%;background-color: #F5F5F5;height: 20rpx;"></view>
		<view class="jianjie-parent">
			<text class="jianjie-txt">家谱简介</text>
			<text class="jianjie-content">{{bookBean.bio}}</text>
		</view>
		<text v-if="bookBean.is_auth==-1" class="btn" @click="jiaruClick">申请加入家谱</text>
		<text v-else-if="bookBean.is_auth==0||bookBean.is_auth==1||bookBean.is_auth==2||bookBean.is_auth==3||bookBean.is_auth==4"
		 class="btn" @click="jinruClick">进入家谱</text>
		<JiapuSubmitApply v-if="jiapuSubmitApplyShow" :firstManagerData="firstManagerData"
		 @managerClick="managerClick" @managerClose="managerClose" @submitManager="submitManager"></JiapuSubmitApply>
		<ChooseManager v-if="chooseManager"  :managerData="managerData" @managerItemClick="managerItemClick"
		 @managerItemClose="managerItemClose"></ChooseManager>
	</view>
</template>
<script>
	import request from '../index/request.js';
	import JiapuSubmitApply from "@/components/jiapu-submit-apply/jiapu-submit-apply.vue";
	import ChooseManager from "@/components/choose-manager/choose-manager.vue";
		
	export default {
		components: {
			JiapuSubmitApply,ChooseManager
		},
		data() {
			return {
				bookBean:null,
				page:1,
				searchKey:"",
				shupuId:"",
				jiapuSubmitApplyShow:false,
				chooseManager:false,
				managerData:null,
				firstManagerData:null,
			}
		},
		methods: {
			onLoad:function(options){
				this.appUtil.saveAppInviteId(options)
				this.shupuId=options.id
				this.getData()
				this.getManagerListData()
			},
			onShow:function(){
				this.share.url='/pages/tabBar/home/index?appInviteId='+this.appUtil.getAppInviteId()
				this.share.shareType=1
			},
			//获取数据
			getData:function(){
				var that=this
				request.post("api/common/getpedigree_info",{
					p_id:this.shupuId,
				}).then(data=>{
					that.bookBean=data
				})
			},
			//加入家谱
			jiaruClick:function(){
				this.jiapuSubmitApplyShow=true
			},
			//进入家谱
			jinruClick:function(){
				uni.navigateTo({
					url: '/pages/familyTree/index?treeId=' +
						this.bookBean.id + '&title=' + this.bookBean.title,
				})
			},
			//获取数据
			getManagerListData:function(){
				var that=this
				request.post("api/common/contactpedigree_auth",{
					p_id:this.shupuId,
				}).then(data=>{
					that.managerData=data.datas
					that.firstManagerData=data.datas[0]
				})
			},
			managerClick:function(){
				this.jiapuSubmitApplyShow=false
				this.chooseManager=true
			},
			managerClose:function(){
				this.jiapuSubmitApplyShow=false
			},
			submitManager:function(e){
				var that=this
				request.post("api/common/applypedigree_auth",{
					p_id:this.shupuId,
					OnPQD:e.OnPQD,
					bio:e.bio,
				}).then(data=>{
					that.jiapuSubmitApplyShow=false
					that.getData()
				})
			},
			managerItemClick:function(e){
				this.firstManagerData=e
			},
			managerItemClose:function(){
				this.chooseManager=false
				this.jiapuSubmitApplyShow=true
			},
		},
	}
</script>

<style>
	@import "index.css";
</style>
